import 'package:flutter/material.dart';
import 'package:get/get.dart';

/// 显示可拖拽的基础对话框
///
/// 这是一个自定义的对话框组件，基于Get.dialog和Stack布局实现，
/// 提供了统一的标题栏样式、关闭按钮和完整的拖拽功能
///
/// @param title 对话框标题，显示在顶部中央，整个标题栏作为拖拽区域
/// @param size 对话框尺寸，可选参数，默认为高度100、宽度500
/// @param child 对话框主要内容部件，显示在中央区域
/// @param closable 是否显示关闭按钮，可选参数，默认为true
/// @param onClose 关闭前的回调函数，可选参数，返回false可阻止关闭
/// ```
Future<void> showBaseDialog(String title, Size? size, Widget? child,
    {bool? closable, bool Function()? onClose}) async {
  // 对话框位置状态变量 - 使用相对坐标定位
  double dialogX = 0; // 对话框左上角的X坐标
  double dialogY = 0; // 对话框左上角的Y坐标

  await Get.dialog(
    // 使用Stack布局实现对话框和背景的叠加
    Stack(
      children: [
        // 半透明背景遮罩层
        Positioned.fill(
          child: Container(
            color: Colors.black54, // 半透明黑色背景
          ),
        ),

        // 可拖拽的对话框主体 - 使用StatefulBuilder实现状态管理
        StatefulBuilder(
          builder: (context, setState) {
            // 在构建时计算居中位置
            final screenSize = MediaQuery.of(context).size;
            final dialogWidth = size?.width ?? 500;
            final dialogHeight = size?.height ?? 100;

            // 如果还没有设置位置，则计算居中位置
            if (dialogX == 0 && dialogY == 0) {
              dialogX = (screenSize.width - dialogWidth) / 2;
              dialogY = (screenSize.height - dialogHeight) / 2;
            }

            return Positioned(
              left: dialogX, // 控制对话框的水平位置
              top: dialogY, // 控制对话框的垂直位置
              child: GestureDetector(
                // 拖拽更新回调 - 当用户拖拽时触发
                onPanUpdate: (details) {
                  setState(() {
                    // 更新对话框位置，跟随手指移动
                    dialogX += details.delta.dx;
                    dialogY += details.delta.dy;

                    // 获取屏幕尺寸，用于边界检测
                    final screenSize = MediaQuery.of(context).size;
                    // 计算对话框在屏幕内的最大可移动范围
                    final maxX = screenSize.width - (size?.width ?? 500) / 2;
                    final maxY = screenSize.height - (size?.height ?? 100) / 2;
                    // 限制对话框位置，确保不会移出屏幕
                    dialogX = dialogX.clamp(-((size?.width ?? 500) / 2), maxX);
                    dialogY = dialogY.clamp(-((size?.height ?? 100) / 2), maxY);
                  });
                },
                // 对话框内容容器
                child: Material(
                  elevation: 8, // 阴影效果
                  borderRadius: BorderRadius.circular(8), // 圆角边框
                  child: Container(
                    height: dialogHeight, // 对话框高度
                    width: dialogWidth, // 对话框宽度
                    decoration: BoxDecoration(
                      color: Colors.white, // 背景色
                      borderRadius: BorderRadius.circular(8), // 圆角
                    ),
                    child: Stack(
                      children: [
                        // 标题栏区域 - 同时也是拖拽手柄
                        Positioned(
                          left: 0,
                          top: 0,
                          right: 0,
                          child: Container(
                            height: 40, // 标题栏高度
                            decoration: BoxDecoration(
                              color: Colors.grey[100], // 浅灰色背景
                              borderRadius: BorderRadius.only(
                                topLeft: Radius.circular(8),
                                topRight: Radius.circular(8),
                              ),
                            ),
                            child: Stack(
                              children: [
                                // 标题文字 - 居中显示
                                Center(
                                  child: Text(
                                    title,
                                    style: TextStyle(
                                      fontSize: 18,
                                      fontWeight: FontWeight.bold,
                                    ),
                                  ),
                                ),

                                // 关闭按钮 - 根据closable参数决定是否显示
                                if (closable == null || closable)
                                  Positioned(
                                    right: 10,
                                    top: 5,
                                    child: IconButton(
                                      icon: Icon(
                                        Icons.close,
                                        color: Color.fromRGBO(166, 166, 166, 1),
                                        size: 20,
                                      ),
                                      onPressed: () {
                                        // 如果有onClose回调，先执行回调
                                        if (onClose != null) {
                                          // 如果回调返回false，阻止关闭
                                          if (!onClose()) {
                                            return;
                                          }
                                        }
                                        // 关闭对话框
                                        Get.back();
                                      },
                                    ),
                                  ),
                              ],
                            ),
                          ),
                        ),

                        // 内容区域 - 在标题栏下方
                        Positioned(
                          top: 40, // 在标题栏下方开始
                          left: 0, // 左对齐
                          right: 0, // 右对齐
                          bottom: 0, // 底部对齐
                          child: Padding(
                            padding: const EdgeInsets.all(20), // 内容内边距
                            child: child ?? SizedBox(), // 显示传入的内容部件
                          ),
                        ),
                      ],
                    ),
                  ),
                ),
              ),
            );
          },
        ),
      ],
    ),
    barrierDismissible: false, // 禁止点击遮罩层关闭对话框
  );
}

// import 'package:flutter/material.dart';
// import 'package:get/get.dart';

// /// 显示可拖拽的基础对话框
// ///
// /// 这是一个自定义的对话框组件，基于Get.dialog和Stack布局实现，
// /// 提供了统一的标题栏样式、关闭按钮和完整的拖拽功能
// ///
// /// @param title 对话框标题，显示在顶部中央，整个标题栏作为拖拽区域
// /// @param size 对话框尺寸，可选参数，默认为高度100、宽度500
// /// @param child 对话框主要内容部件，显示在中央区域
// /// @param closable 是否显示关闭按钮，可选参数，默认为true
// /// @param onClose 关闭前的回调函数，可选参数，返回false可阻止关闭
// /// ```
// Future<void> showBaseDialog(String title, Size? size, Widget? child,
//     {bool? closable, bool Function()? onClose}) async {
//   // 对话框位置状态变量 - 使用相对坐标定位
//   double dialogX = 0; // 对话框左上角的X坐标
//   double dialogY = 0; // 对话框左上角的Y坐标

//   await Get.dialog(
//     // 使用Stack布局实现对话框和背景的叠加
//     Stack(
//       children: [
//         // 半透明背景遮罩层
//         Positioned.fill(
//           child: Container(
//             color: Colors.black54, // 半透明黑色背景
//           ),
//         ),

//         // 可拖拽的对话框主体 - 使用StatefulBuilder实现状态管理
//         StatefulBuilder(
//           builder: (context, setState) {
//             return Positioned(
//               left: dialogX, // 控制对话框的水平位置
//               top: dialogY, // 控制对话框的垂直位置
//               child: GestureDetector(
//                 // 拖拽更新回调 - 当用户拖拽时触发
//                 onPanUpdate: (details) {
//                   setState(() {
//                     // 更新对话框位置，跟随手指移动
//                     dialogX += details.delta.dx;
//                     dialogY += details.delta.dy;

//                     // 获取屏幕尺寸，用于边界检测
//                     final screenSize = MediaQuery.of(context).size;
//                     // 计算对话框在屏幕内的最大可移动范围
//                     final maxX = screenSize.width - (size?.width ?? 500) / 2;
//                     final maxY = screenSize.height - (size?.height ?? 100) / 2;
//                     // 限制对话框位置，确保不会移出屏幕
//                     dialogX = dialogX.clamp(-((size?.width ?? 500) / 2), maxX);
//                     dialogY = dialogY.clamp(-((size?.height ?? 100) / 2), maxY);
//                   });
//                 },
//                 // 对话框内容容器
//                 child: Material(
//                   elevation: 8, // 阴影效果
//                   borderRadius: BorderRadius.circular(8), // 圆角边框
//                   child: Container(
//                     height: size?.height ?? 100, // 对话框高度
//                     width: size?.width ?? 500, // 对话框宽度
//                     decoration: BoxDecoration(
//                       color: Colors.white, // 背景色
//                       borderRadius: BorderRadius.circular(8), // 圆角
//                     ),
//                     child: Stack(
//                       children: [
//                         // 标题栏区域 - 同时也是拖拽手柄
//                         Positioned(
//                           left: 0,
//                           top: 0,
//                           right: 0,
//                           child: Container(
//                             height: 40, // 标题栏高度
//                             decoration: BoxDecoration(
//                               color: Colors.grey[100], // 浅灰色背景
//                               borderRadius: BorderRadius.only(
//                                 topLeft: Radius.circular(8),
//                                 topRight: Radius.circular(8),
//                               ),
//                             ),
//                             child: Stack(
//                               children: [
//                                 // 标题文字 - 居中显示
//                                 Center(
//                                   child: Text(
//                                     title,
//                                     style: TextStyle(
//                                       fontSize: 18,
//                                       fontWeight: FontWeight.bold,
//                                     ),
//                                   ),
//                                 ),

//                                 // 关闭按钮 - 根据closable参数决定是否显示
//                                 if (closable == null || closable)
//                                   Positioned(
//                                     right: 10,
//                                     top: 5,
//                                     child: IconButton(
//                                       icon: Icon(
//                                         Icons.close,
//                                         color: Color.fromRGBO(166, 166, 166, 1),
//                                         size: 20,
//                                       ),
//                                       onPressed: () {
//                                         // 如果有onClose回调，先执行回调
//                                         if (onClose != null) {
//                                           // 如果回调返回false，阻止关闭
//                                           if (!onClose()) {
//                                             return;
//                                           }
//                                         }
//                                         // 关闭对话框
//                                         Get.back();
//                                       },
//                                     ),
//                                   ),
//                               ],
//                             ),
//                           ),
//                         ),

//                         // 内容区域 - 在标题栏下方
//                         Positioned(
//                           top: 20, // 在标题栏下方开始
//                           left: 0, // 左对齐
//                           right: 0, // 右对齐
//                           bottom: 0, // 底部对齐
//                           child: Padding(
//                             padding: const EdgeInsets.all(20), // 内容内边距
//                             child: child ?? SizedBox(), // 显示传入的内容部件
//                           ),
//                         ),
//                       ],
//                     ),
//                   ),
//                 ),
//               ),
//             );
//           },
//         ),
//       ],
//     ),
//     barrierDismissible: false, // 禁止点击遮罩层关闭对话框
//   );
// }

// import 'package:flutter/material.dart';
// import 'package:get/get.dart';
// import 'package:flutter/cupertino.dart';

// /// 显示基础对话框
// ///
// /// 这是一个自定义的对话框组件，基于GetX的defaultDialog进行封装，
// /// 提供了统一的标题栏样式和关闭按钮
// ///
// /// @param title 对话框标题，显示在左上角
// /// @param size 对话框尺寸，可选参数，默认为高度100、宽度500
// /// @param child 对话框主要内容部件，显示在中央区域
// /// @param closable 是否显示关闭按钮，可选参数，默认为true
// /// @param onClose 关闭前的回调函数，可选参数，返回false可阻止关闭
// /// ```
// Future<void> showBaseDialog(String title, Size? size, Widget? child,
//     {bool? closable, bool Function()? onClose}) async {
//   await Get.defaultDialog(
//     title: "", // 清空默认标题
//     titlePadding: EdgeInsets.all(0), // 标题内边距设为0
//     titleStyle: TextStyle(fontSize: 0), // 标题样式，字体大小为0
//     barrierDismissible: false, // 禁止点击遮罩层关闭
//     content: SizedBox(
//       height: size == null ? 100 : size.height, // 设置对话框高度，默认为100
//       width: size == null ? 500 : size.width, // 设置对话框宽度，默认为500
//       child: Stack(
//         children: [
//           // 标题 - 显示在左上角
//           Positioned(
//             left: 10,
//             top: 0,
//             child: Text(
//               title,
//               style: TextStyle(fontSize: 20, fontWeight: FontWeight.bold),
//             ),
//           ),

//           // 关闭按钮 - 根据closable参数决定是否显示
//           Visibility(
//             visible: closable == null || closable, // 默认为true
//             child: Positioned(
//               right: 1,
//               top: 0,
//               child: InkWell(
//                 onTap: () {
//                   // 如果有onClose回调，先执行回调
//                   if (onClose != null) {
//                     // 如果回调返回false，阻止关闭
//                     if (!onClose()) {
//                       return;
//                     }
//                   }
//                   // 关闭对话框
//                   Navigator.pop(Get.context!);
//                 },
//                 child: Container(
//                   margin: EdgeInsets.all(5),
//                   child: const Icon(
//                     Icons.clear,
//                     color: Color.fromRGBO(166, 166, 166, 1), // 灰色关闭图标
//                   ),
//                 ),
//               ),
//             ),
//           ),

//           // 主要内容 - 居中显示，带有内边距
//           Center(
//             child: Padding(
//               padding: const EdgeInsets.only(
//                   top: 20, // 顶部留出标题空间
//                   left: 40,
//                   right: 40),
//               child: child, // 显示传入的内容部件
//             ),
//           ),
//         ],
//       ),
//     ),
//   );
// }
